<template>
    <div class="scrollbox">
        <!-- 头部 -->
        <v-header></v-header>
        <div class="dis10"></div>
        <div class="listbox aps9">
            <v-list
                    api="user.get_user_log"
                    ref="list"
                    cards="1"
                    cols="200,200,,200,200"
                    :params="params"
            >
                <template slot="search">&nbsp;&nbsp;
                </template>
                <template slot="head" slot-scope="props">
                    <thead>
                    <tr class="tr">
                        <th class="c1">用户</th>
                        <th>操作</th>
                        <th>详情</th>
                        <th>IP地址</th>
                        <th>日期</th>
                    </tr>
                    </thead>
                </template>
                <template slot="item" slot-scope="props">
                    <tr class="font-gray">
                        <td class="font-blue f14">
                            <span v-if="!props.item.uname">-</span>{{ props.item.uname }}
                            <span class="font-gray2 f12">({{ props.item.uid }})</span>
                        <td>
                            <span v-if="!props.item.action">-</span>
                            {{props.item.action}}
                        </td>
                        <td>
                            <span v-if="!props.item.log">-</span>
                            {{props.item.log}}
                        </td>
                        <td>
                            {{props.item.realip}}
                        </td>
                        <td>
                            {{props.item.dateline | dateFormat("yyyy-MM-dd HH:mm")}}
                        </td>
                    </tr>
                </template>
            </v-list>
        </div>

        <!-- 编辑 -->
        <el-dialog :title="editData.title" :visible.sync="editData.status" width="680px" top="7vh">
            <div class="dialogform">
                <el-form
                        :model="form"
                        :rules="rules"
                        ref="form"
                        label-width="120px"
                        label-position="right"
                        class="demo-ruleForm"
                >
                    <el-form-item label="账号">
                        <el-input v-model="form.uname"></el-input>
                    </el-form-item>
                    <el-form-item label="密码">
                        <el-input v-model="form.upass" type="password"></el-input>
                    </el-form-item>
                    <el-form-item label="邮箱">
                        <el-input v-model="form.email"></el-input>
                    </el-form-item>
                    <el-form-item label="手机">
                        <el-input v-model="form.mobile"></el-input>
                    </el-form-item>
                    <!--<el-form-item label="uid">-->
                    <!--<el-input v-model="form.uid"></el-input>-->
                    <!--</el-form-item>-->
                    <el-form-item label="姓名">
                        <el-input v-model="form.nick" class="w200"></el-input>
                    </el-form-item>
                    <el-form-item label prop="inlock">
                        <el-button type="primary" @click="save">保 存</el-button>
                        <el-button @click="editData.status = false">取 消</el-button>
                    </el-form-item>
                </el-form>
            </div>
            <div slot="footer" class="tc"></div>
        </el-dialog>
        <!-- 编辑结束 -->
        <!-- 详情开始 -->
        <v-baseinfo v-model="drawer.show" :name="drawer.name">
            <div class="wrapper-content" v-if="drawer.data" slot="user/list">
                <div class="content-item">
                    <span class="label">联盟编码：</span>
                    <span class="value">{{drawer.data.union_id || '-'}}</span>
                </div>
                <div class="content-item">
                    <span class="label">UID：</span>
                    <span class="value">{{drawer.data.uid || '-'}}</span>
                </div>
                <div class="content-item">
                    <span class="label">邮箱：</span>
                    <span class="value">{{drawer.data.email || '-'}}</span>
                </div>
                <div class="content-item">
                    <span class="label">手机：</span>
                    <span class="value">{{drawer.data.mobile || '-'}}</span>
                </div>
                <div class="content-item">
                    <span class="label">姓名：</span>
                    <span class="value">{{drawer.data.realname || '-'}}</span>
                </div>
                <div class="content-item">
                    <span class="label">系统角色：</span>
                    <span class="value">{{drawer.data.purview_sys_name || '-'}}</span>
                </div>
                <div class="content-item">
                    <span class="label">阿里用户ID：</span>
                    <span class="value">{{drawer.data.user_id || '-'}}</span>
                </div>
                <div class="content-item">
                    <span class="label">注册IP：</span>
                    <span class="value">{{drawer.data.regip || '-'}}</span>
                </div>
                <div class="content-item">
                    <span class="label">注册时间：</span>
                    <span class="value">{{drawer.data.regdateline | dateFormat('yyyy-MM-dd HH:mm:ss')}}</span>
                </div>
                <div class="content-item">
                    <span class="label">登录IP：</span>
                    <span class="value">{{drawer.data.logip || '-'}}</span>
                </div>
                <div class="content-item">
                    <span class="label">登陆时间：</span>
                    <span class="value">{{drawer.data.logdateline | dateFormat('yyyy-MM-dd HH:mm:ss')}}</span>
                </div>
                <div class="content-item">
                    <span class="label">登陆次数：</span>
                    <span class="value">{{drawer.data.logtimes || '-'}}</span>
                </div>
                <div class="content-item">
                    <span class="label">是否锁定：</span>
                    <span class="value font-green" v-if="!drawer.data.inlock">正常</span>
                    <span class="value font-red" v-else>锁定</span>
                </div>
                <div class="content-item">
                    <span class="label">备注：</span>
                    <span class="value">{{drawer.data.label || '-'}}</span>
                </div>
            </div>
        </v-baseinfo>
        <!-- 详情结束 -->
    </div>
</template>
<script>
    import {cacheUnion, cacheConfig} from "@cache";

    export default {
        data() {
            return {
                form: {
                    uid: 0,
                    uname: "",
                    upass: "",
                    email: "",
                    mobile: "",
                    nick: "",
                },
                editData: {
                    status: false,
                    title: "",
                    id: 0
                },
                rules: {
                    upass: [
                        {
                            type: "string",
                            required: true,
                            message: "请输入密码",
                            trigger: "blur"
                        },
                        {min: 1, message: "密码不能为空", trigger: "blur"}
                    ]
                },
                params: {},
                drawer: {
                    show: false,
                    data: {},
                    name: "会员管理"
                },
                menu: [],
                purMenu: [],
                loading: false
            };
        },
        watch: {
            "drawer.show": {
                handler(newV) {
                    if (!newV) {
                        this.drawer.data = null;
                        this.purMenu = [];
                    }
                }
            }
        },
        methods: {
            edit(item) {
                console.log(item)
                if (JSON.stringify(item) === '{}') {
                    this.editData.title = '添加会员信息'
                } else {
                    this.editData.title = '修改会员信息'
                }
                this.editData.status = true;
                this.editData.id = item.uid || 0;
                this.form.uid = item.uid || 0;
                this.form.uname = item.uname || "";
                this.form.upass = item.upass || "";
                this.form.email = item.email || "";
                this.form.mobile = item.mobile || "";
                this.form.nick = item.nick || "";
            },
            // clear(item) {
            //   this.$api.jget("system.del_user_cache", { uid: item.uid }).then(res => {
            //     if (res.status === 1) {
            //       this.$success(res.msg);
            //     }
            //   });
            // },
            save() {
                let that = this;
                that.$refs["form"].validate(valid => {
                    if (valid) {
                        let url = that.editData.id > 0 ? "user.edit_user" : "user.add_user";
                        that.$api.jpost(url, that.form).then(res => {
                            if (res.status === 1) {
                                this.$success(res.msg);
                                that.$refs.list.fetchData();
                                that.editData.status = false;
                            } else {
                                that.$error(res.msg);
                            }
                        }).catch(() => {});
                    }
                });
            },
            // 测试
            getTest() {
                this.$api.get("user.get_user_detail").then(res => {
                    if (res.status === 1) {
                        // console.log(res)
                    }
                }).catch(() => {});
            },
            // 刷新缓存
            refresh() {
                this.$api.get("system.refresh_sys_union").then(res => {
                    if (res.status === 1) {
                        this.$success(res.msg);
                        this.$refs.list.fetchData();
                    }
                }).catch(() => {});
            },
            del(row) {
                let that = this;
                that
                    .$confirm("此操作会将该彻底删除，不可恢复, 是否继续?", "删除提醒")
                    .then(() => {
                        that.$api
                            .post("system.delete_sys_union", {id: row.id})
                            .then(res => {
                                if (res.status === 1) {
                                    that.$success(res.msg);
                                    that.$refs.list.fetchData();
                                } else {
                                    that.$error(res.msg);
                                }
                            }).catch(() => {});
                    })
            },
            setBaseInfo(item) {
                this.$api.get("user.get_user_detail", {uid: item.uid}).then(res => {
                    this.drawer.data = res.data;
                });
                this.drawer.show = true;
            },
            // getPurview() {
            //   this.$api
            //       .jget("system.get_sys_purview", {
            //         type: "sys",
            //         union_id: "SYS"
            //       })
            //       .then(res => {
            //         if (res.status === 1) {
            //           this.purMenu = res.data;
            //         } else {
            //           this.$error(res.msg);
            //         }
            //       });
            // },
            addTemp() {
                this.loading = true;
                this.$api.jget("user.add_user_by_tmp").then(res => {
                    if (res.status === 1) {
                        this.params = {
                            page: 1
                        };
                        this.loading = false;
                        this.$success(res.msg);
                    } else {
                        this.$error(res.msg);
                    }
                });
            }
        },
        mounted() {
            this.menu = cacheUnion.load("YY:union");
            // this.getPurview();
            // this.getTest();

        }
    };
</script>

<style lang="scss" scoped>
    .tabs {
        width: 290px;
    }
</style>
